import React,{useState} from "react";
import { 
    Linking,
    SafeAreaView,
    StyleSheet,
    View,
 } from "react-native";
import {Input,ConfirmButton,Tips,NavBar} from "../common/loginComponets";
import { get, post } from "../api/HiNet";
import Constants from "../api/Constants";
import LoginApi from "../api/login";
import { Link } from "expo-router";
import NavigationUtil from "../navigator/NavigationUtil";

 export const Login = (props:any) => {
    const {navigation} = props
    
    const [userName,setUserName] = useState('')
    const [password,setPassword] = useState('')
    const [msg,setMsg] = useState('add')
    const [helpUrl,setHelpUrl] = useState('https://reactnative.cn/docs/0.76/accessibilityinfo')
    const onLogin = () => {
        if(userName === '' || password === ''){
            setMsg('用户名或密码不能为空')
            return
        }
        setHelpUrl('')
        setMsg('')
        LoginApi.getInstance()
        .login(userName,password)
        .then((res) => {
            setMsg('登录成功')
            // 跳转首页
            NavigationUtil.resetToHomePage({navigation})
        }).catch((e) => {
            const {code,data:{helpUrl=''} ={},msg} = e
            setMsg(msg)
            setHelpUrl(helpUrl)
        })
    }
    return(
        <SafeAreaView style={styles.root}>
            <NavBar title="登录" rightTitle="注册" onRightClick={() => {
               NavigationUtil.regisration({navigation})
            }}></NavBar>
            <View style={styles.line}></View>
            <View style={styles.content}>
                <Input
                label="用户名"
                placeholder="请输入用户名"
                shortLine={true}
                onChangeText={(text: any) => setUserName(text.target.value)
                }
                >
                </Input>
                <Input
                label="密码"
                placeholder="请输入密码"
                secure={true}
                onChangeText={(text:any) => setPassword(text.target.value)}
                >
                </Input>
                <ConfirmButton title="登录" onClick={onLogin}></ConfirmButton>
                <Tips msg={msg} helpUrl={helpUrl}></Tips>
            </View>
        </SafeAreaView>
    )
 }

 const styles = StyleSheet.create({
    root:{
        flex:1
    },
    content:{
        paddingTop:20,
        backgroundColor:'#F1F5F6',
        flexGrow:1
    },
    line:{
        height:0.5,
        backgroundColor:'#D0D4D4'
    }
 })

 export default Login